<!DOCTYPE html>
<html lang="en">
<head>
  <script src="/js/vue.js"></script>
  <script src="/js/axios.min.js"></script>

  <title>Products Archive</title>
  <meta charset="utf-8" />

  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <!-- GOOGLE WEB FONTS -->
  <link rel="stylesheet" href="css/font-awesome.min.css">

  <!-- BOOTSTRAP 3.3.7 CSS -->
  <link rel="stylesheet" href="css/bootstrap.min.css" />

  <!-- SLICK v1.6.0 CSS -->
  <link rel="stylesheet" href="css/slick-1.6.0/slick.css" />

  <link rel="stylesheet" href="css/jquery.fancybox.css" />
  <link rel="stylesheet" href="css/yith-woocommerce-compare/colorbox.css" />
  <link rel="stylesheet" href="css/owl-carousel/owl.carousel.min.css" />
  <link rel="stylesheet" href="css/owl-carousel/owl.theme.default.min.css" />
  <link rel="stylesheet" href="css/js_composer/js_composer.min.css" />
  <link rel="stylesheet" href="css/woocommerce/woocommerce.css" />
  <link rel="stylesheet" href="css/yith-woocommerce-wishlist/style.css" />
  <link rel="stylesheet" href="css/custom.css" />
  <link rel="stylesheet" href="css/app-orange.css" id="theme_color" />
  <link rel="stylesheet" href="" id="rtl" />
  <link rel="stylesheet" href="css/app-responsive.css" />
</head>
<body class="archive post-type-archive woocommerce post-type-archive-product">
<div class="body-wrapper theme-clearfix" >
  <header id="header" class="header header-style1">
    <div class="header-mid clearfix">
      <div class="container">
        <div class="rows">
          <!-- 右上LOGO -->
          <div class="etrostore-logo pull-left">
            <br>
            <br>
            <h1 style="color:orange">CABBAGE</h1>
            <H4 style="color:rgb(189, 189, 189)">Your Online Bookstore</H4>
          </div>
          <!-- /右上LOGO -->
        </div>
      </div>
    </div>
  </header>
  <div class="container" id="app">
    <div class="modal-dialog block-popup-login">
      <div class="tt_popup_login">
        <strong>登录/注册</strong>
      </div>
      <form action="" method="post" class="login" >
        <div class="block-content">
          <div class="col-reg registered-account">
            <div class="email-input">
              <input v-model="userName" type="text" class="form-control input-text username" name="userName" id="userName" placeholder="Username" />
            </div>
            <div class="pass-input">
              <input v-model="password" class="form-control input-text password" type="password" placeholder="Password" name="password" id="password" />
            </div>
            <br/>
            <div class="actions">
              <div class="submit-login">
                <button type="button" @click="login(userName)" class="button btn-submit-login">登录</button>
              </div>
            </div>
          </div>
          <div class="col-reg login-customer">
            <h2>还未注册账户?</h2>
            <p class="note-reg">注册非常简单</p>
            <ul class="list-log">
              <li>输入你想要的用户名和密码 <br/>点击注册</li>
            </ul>
            <div class="btn-reg-popup"><a href="register.html">注册</a></div>
          </div>
        </div>
      </form>
      <div class="clear"></div>  <!--悬浮对话框底色为白色，可见-->
    </div>
  </div>

  <footer id="footer" class="footer default theme-clearfix">
    <div class="footer-copyright style1">
      <div class="container">
        <!-- Copyright text -->
        <div class="copyright-text">
          <center><p>Copyright &copy; 2022.Company name All rights reserved.cabbage</p></center>
        </div>
      </div>
    </div>
  </footer>
  <!-- /Copyright text -->
</div>
<script type="text/javascript" src="js/jquery/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery/jquery-migrate.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery/js.cookie.min.js"></script>
<!-- OPEN LIBS JS -->
<script type="text/javascript" src="js/owl-carousel/owl.carousel.min.js"></script>
<script type="text/javascript" src="js/slick-1.6.0/slick.min.js"></script>
<script type="text/javascript">
  /* <![CDATA[ */
  var woocommerce_price_slider_params = {"currency_symbol":"$","currency_pos":"left","min_price":"100","max_price":"500"};
  /* ]]> */
</script>
<script type="text/javascript" src="js/widget.min.js"></script>
<script type="text/javascript" src="js/mouse.min.js"></script>
<script type="text/javascript" src="js/slider.min.js"></script>
<script type="text/javascript" src="js/js_composer/js_composer_front.min.js"></script>
<script type="text/javascript" src="js/yith-woocommerce-compare/jquery.colorbox-min.js"></script>
<script type="text/javascript" src="js/sw_core/isotope.js"></script>
<script type="text/javascript" src="js/sw_core/jquery.fancybox.pack.js"></script>
<script type="text/javascript" src="js/sw_woocommerce/category-ajax.js"></script>
<script type="text/javascript" src="js/sw_woocommerce/jquery.countdown.min.js"></script>
<script type="text/javascript" src="js/woocommerce/price-slider.min.js"></script>
<script type="text/javascript" src="js/plugins.js"></script>
<script type="text/javascript" src="js/megamenu.min.js"></script>
<script type="text/javascript" src="js/main.min.js"></script>
<script type="text/javascript" src="js/vue.js"></script>
<script src="/js/axios.min.js"></script>

<script type="text/javascript">
</script>
</body>
</html>
<script>
  new Vue({
    el:"#app",
    data:{
      userName:'',
      password:''
    },
    methods:{
      login:function(userName){
        // alert(userName);
        window.localStorage.setItem("userName",userName);
        //location.href="index.html"
        axios.get('/user/check',{
          params: {
            userName:this.userName,
            password:this.password
          }
        })
                .then(function (response) {
                  // if(response.data.code==200) {
                  //   alert(response.data.message);
                  // }
                  // else{
                  //   if(response.data.code==201){
                  //     alert(response.data.message);
                  //   }else{
                      if(response.data.code==202){
                        location.href="index.html";
                        console.log(response.data.code)
                      }else{
                        alert(response.data.message);
                      }
                  //   }
                  // }
                })

                .catch(function (error) {
                  console.log(error);
                });

      }
    }
  })
</script>